/****Website layout****/
body{
    margin: 0;
    font-family: 'Metrophobic', sans-serif;
    background-color: #D6EBFF;
}
#header{
    width:100%;
    height:60px;
    position:fixed;
    background-color: #CC0000;
    color:white;
    vertical-align: bottom;
    border-bottom: 1px solid #990000;
    background-image: url('img/logo.png');
    background-repeat: no-repeat;
    background-position: 10px 10px;
    z-index: 100;
}
#header #logo{
    height: 50px;
}
#header #logo img{
    margin: 10px;
}
#header #menu{
    margin-top:20px;
    height: 25px;
    text-align: center;
    font-size: 18px;
}
#header #menu ul
{
    list-style-type:none;
    margin:0;
    padding:0;
}
#header #menu li
{
    display:inline-block;
    width:120px;
    background-color: #DD0000;
    border-radius:5px;
}
#header #menu li a { 
    margin: 0px; 
    display: block; 
    width: 100%; 
    height: 100%; 
    color:#fff;
    text-decoration: none;
}
#header #menu li:hover
{
    background-color: #EE0000;
}
#header #search{
    top:18px;
    position: fixed;
    right: 140px;
    font-size: 18px;
    z-index:100;
    text-align: center;
    border-radius: 5px;
}
#header #logout{
    top:20px;
    position: fixed;
    right:10px;
    width:100px;
    height: 21px;
    font-size: 18px;
    z-index:100;
    display:block;
    width: 120px;
    background-color: #DD0000;
    text-align: center;
    border-radius: 5px;

}
#header #logout:hover{
    background-color: #EE0000;
}
#container{
    position:absolute;
    width:80%;
    margin-top:80px;
    min-height: 500px;
}
#content{
    padding:10px;
    margin:auto;
    margin-top:10px;
    top:100px;
    width:800px;
    height: 100%;
    border:1px solid #000000;
    border-radius: 5px;
    background-color:#fff;
}
#footer{
    padding:10px;
    margin:auto;
    margin-top:10px;
    width:800px;
    border:1px solid #000000;
    border-radius: 5px;
}
.clear {
    clear: both;
}
label{
    display:inline-block;
    width:150px;
}

/****Chat****/
.chatusername{
    width:200px;

}
.chat_msg_own{
    color:#006600;
}
.chat_msg_other{
    color:#660000;
}
.chatmsg{
    display:inline-block;
    width:150px;
    padding-left:30px;
    vertical-align: top;
}
#chat_list{
    margin-top:10px;
}
.chat_list_names{
    width:150px;
    display:inline-block;
}
.chat_list_row{
    margin:2px;
    background-color: #d00;
    border-radius:4px;
    padding: 3px;
    color:#fff;
}
.chat_list_row:hover{
    background-color: #e00;
}
#chat{
    position:fixed;
    padding:10px;
    right:0px;
    top:61px;
    width: 200px;
    border-left: 1px solid #ccc;
    height: 100%;
    background-color:#fff;
}

/*Profile page*/
#profileimage {
    width: 175px;
    height: 175px;
    float:left;
    border: 1px solid #000000;
}
#infoshort {
    padding: 5px 5px 5px 10px;
    width: 525px;
    height: 175px;
    float:left;
}
#infolong {

}
.post_block {
    width: 700px;
    margin-top: 5px;
}
.post_block a {
    text-decoration: none;
}
.post {
    width: 100%;
}
.post .post_img {
    float: left;
    width: 50px;
    height: 50px;
    border: 1px solid #000000;
    margin-right: 5px;
}
.post .post_message {
    float: left;
    text-decoration: none;
}
.post_reaction_block {
    width: 650px;
    background-color: #D6F3F7;
    margin-top: 10px;
    margin-left: 60px;
    padding: 10px;
}
.post_reaction {
    width: 100%;
    margin-top: 5px;
}
.post_reaction .post_reaction_img {
    float: left;
    width: 50px;
    height: 50px;
    border: 1px solid #000000;
    margin-right: 5px;
}
.post_reaction .post_reaction_message {
    float: left;
}
.submit_reaction {
    background-color:#CC0000; 
    color:#FFFFFF; 
    border:none; 
    font-size:11px; 
    padding:3px; 
    margin-top:3px;
}

#submitMessage {
    background-color:#CC0000; 
    color:#FFFFFF; 
    border:none; 
    font-size:11px; 
    padding:3px; 
    margin-top:3px;    
}

.epicButton {
    background-color:#CC0000; 
    color:#FFFFFF; 
    border:none; 
    font-size:11px; 
    padding:3px; 
    margin-top:3px;    
}

/****Icons****/
.remove{
    margin:0px;
    padding:0px;
    float:right;
    width:18px;
    height:18px;
    background-image: url('img/remove.png');
    background-size: 18px 18px;
    background-repeat: no-repeat;
}
.remove_submit{
    border: 0px; 
    width: 18px; 
    height: 18px;   
    background-image: url('img/remove.png'); 
    background-size: 18px 18px;
    background-repeat: no-repeat;
}

/****loading****/
#loading {
    position:fixed;
    z-index: 1000;
    width:46px;
    height:56px;
    margin-left: 47%;
    margin-top: 25%;
    background-image: url('img/loading.gif');
    background-size: 46px 56px;
    background-repeat: no-repeat;
    display:none;
}

